import ProTable from '@ant-design/pro-table';
import { useMount, useRequest } from 'ahooks';
import React, { useEffect, useState } from 'react';

import { Menu, message, Switch } from 'antd';

import EditInvitation from '@/pages/Act/components/EditInvitation';
import {
  agentCategoryState,
  findByPageInvitationCategoryIdList,
  findInvitationCategoryByList,
} from '@/services/agent';
import { getResult } from '@/services/sys/attribute';

const getAttr = async (key: string) => {
  let result = await getResult(key, 0);
  console.log('getAttr----------------------', result);
  return result;
};
const columns = [
  {
    title: '编号',
    dataIndex: 'index',
    key: 'index',
    valueType: 'indexBorder',
  },
  {
    title: '推荐人等级',
    dataIndex: 'agentName',
    key: 'agentName',
    search: false,
  },
  {
    title: '下单代理等级',
    dataIndex: 'relationAgentName',
    key: 'relationAgentName',
    search: false,
  },
  {
    title: '当前的等级',
    dataIndex: 'currentUpgradeAgentName',
    key: 'currentUpgradeAgentName',
    search: false,
  },
  {
    title: '升级等级',
    dataIndex: 'upgradeAgentName',
    key: 'upgradeAgentName',
    search: false,
  },
  {
    title: '代理门槛',
    dataIndex: 'price',
    key: 'price',
    search: false,
    render: (
      _: any,
      row: API.AgentInvitationRelationship,
      index: number,
      action: any,
    ) => {
      return (row.price ? row.price : 0) + (row.isPrice == 0 ? '￥' : '%');
      // return row.price+(row.isPrice==0?'￥':'%')
    },
  },
  {
    title: '升级提成',
    dataIndex: 'upgradePrice',
    valueType: 'money',
    key: 'upgradePrice',
    search: false,
  },
  {
    title: '升级减',
    dataIndex: 'reduceUpgradePrice',
    valueType: 'money',
    key: 'reduceUpgradePrice',
    search: false,
  },
  {
    title: '商品上级提成',
    dataIndex: 'parentPrice',
    valueType: 'money',
    key: 'parentPrice',
    search: false,
  },
  {
    title: '一级返利',
    dataIndex: 'level1',
    render: (
      _: any,
      row: API.AgentInvitationRelationship,
      index: number,
      action: any,
    ) => {
      return (row.level1 ? row.level1 : 0) + (row.isLevel == 0 ? '￥' : '%');
    },
    key: 'level1',
    search: false,
  },
  {
    title: '二级返利',
    dataIndex: 'level2',
    render: (
      _: any,
      row: API.AgentInvitationRelationship,
      index: number,
      action: any,
    ) => {
      return (row.level2 ? row.level2 : 0) + (row.isLevel == 0 ? '￥' : '%');
    },
    key: 'level12',
    search: false,
  },
  {
    title: '三级返利',
    dataIndex: 'level3',
    render: (
      _: any,
      row: API.AgentInvitationRelationship,
      index: number,
      action: any,
    ) => {
      return (row.level3 ? row.level3 : 0) + (row.isLevel == 0 ? '￥' : '%');
    },
    key: 'level13',
    search: false,
  },

  {
    title: '时间',
    dataIndex: 'createDate',
    valueType: 'dateTime',
    key: 'createDate',
    search: false,
    hideInTable: true,
  },
  {
    title: '商品名称',
    dataIndex: 'goodsName',
    key: 'goodsName',
    search: false,
  },
  {
    title: '状态',
    key: 'state',
    dataIndex: 'state',
    valueType: 'select',
    // valueEnum: getAttr ( "agentInvitationRelationship" ),
    valueEnum: await getResult('agentInvitationRelationship', 0),
    //   hideInTable: true,
  },
  /*  {
    title: '活动',
    dataIndex: 'isActivty',
    valueType: 'switch',
    key: 'isActivty'
  },*/

  {
    title: '操作',
    width: '164px',
    key: 'option',
    valueType: 'option',
    search: false,
    render: (
      _: any,
      row: API.AgentInvitationRelationship,
      index: number,
      action: any,
    ) => [<EditInvitation text={'编辑'} row={row} onSuccess={() => {
      action.reload();
}} />],
  },
];
const page: React.FC = () => {
  const [menu, setMenu] = useState<any>();
  const [check, setCheck] = useState<boolean>();
  const { data: dataCategory, runAsync: run } = useRequest(
    findInvitationCategoryByList,
  );
  const { data, runAsync, loading } = useRequest(
    findByPageInvitationCategoryIdList,
  );

  const [key, setKey] = useState('1');
  useMount(() => {
    // fetchByPageList ( {} );
    run().then((res) => {
      setMenu(res[0]);
      setCheck(res[0]?.state > 0);
    });
  });
  useEffect(() => {
    // fetchByPageList ( {} );
    runAsync(key);
  }, [key]);
  // @ts-ignore
  // @ts-ignore
  return (
    <>
      <ProTable<API.AgentInvitationRelationship>
        columns={columns}
        params={{ categoryId: key, type: 1 }}
        dataSource={data}
        loading={loading}
        search={{
          defaultCollapsed: false,
          labelWidth: 'auto',
        }}

        headerTitle={
          <Switch
            checkedChildren="开启"
            unCheckedChildren="关闭"
            checked={check}
            onChange={(checked) => {
              console.log('switch', checked);
              // setSwitch ( checked );
              if (checked === true) {
                agentCategoryState(key)
                  .then((res) => {
                    setCheck(checked);
                    message.success('启动成功');
                    run();
                  })
                  .catch((err) => {
                    message.error(err.msg);
                  });
              } else {
                message.error('不能权限');
              }
            }}
          >
            添加
          </Switch>
        }
        toolBarRender={() => [
          <EditInvitation
            row={{ categoryId: key }}
            text={'新增'}
            isCard={true}
          />,
        ]}
        onSubmit={(params) => {
          // fetchByPageList ( params );
          console.log('onSubmit', params);
          // setParams ( {...params} )
          // fetchByPageList ( params );
        }}
        tableRender={(_, dom) => (
          <div
            style={{
              display: 'flex',
              width: '100%',
            }}
          >
            <Menu
              onSelect={(e) => {
                setKey(e.key as string);
                let item = e?.item?.props;
                console.log('onSelect', e?.item?.props);
                setMenu(item);
                setCheck(item?.state > 0);
              }}
              onChange={(e) => console.log('onChange', e)}
              style={{ width: 256 }}
              selectedKeys={[key]}
              mode="inline"
              key={'id'}
              items={dataCategory}
            />
            <div
              style={{
                flex: 1,
              }}
            >
              {dom}
            </div>
          </div>
        )}
      ></ProTable>
    </>
  );
};

export default page;
